<template>
    <sc-table-select
        placeholder="---请选择---"
        ref="tableselect"
        v-model="orgcodevalue"
        style="width: 300px"
        :pageId="pageId"
        :userCode="userCode"
        :purviewType="purviewType"
        :attrList="attrList"
        :valueList="valueList"
        :queryList="materialQueryList"
        :orderList="orderList"
        :table-width="640"
        :multiple="multiple"
        :queryType="queryType"
        selectType="org"
        collapse-tags
        collapse-tags-tooltip
        :props="props"
        :selectKeyValue="selectKeyValue"
        @change="change"
        @remove-tag="removeTag"
    >
        <!-- collapse-tags
        collapse-tags-tooltip-->
        <template #header="{}">
            <el-form :inline="true">
                <el-row :gutter="5">
                    <el-col :span="5">
                        <el-input v-model="materialQueryList.materialCode" placeholder="请输入编码" style="width: 125px" @keyup.enter="opBindData"></el-input>
                    </el-col>
                    <el-col :span="5">
                        <el-input v-model="materialQueryList.materialName" placeholder="请输入名称" style="width: 125px" @keyup.enter="opBindData"></el-input>
                    </el-col>
                    <!-- <el-col :span="8">
                        <el-tree-select
                            placeholder="---请选择物料分类---"
                            collapse-tags
                            collapse-tags-tooltip
                            v-model="materialQueryList.materialTypeIds"
                            :props="{ label: 'label', value:'value',children: 'children' }"
                            :data="materialTypeTree"
                            multiple
                            :render-after-expand="false"
                            show-checkbox
                            style="width: 200px"
                        />
                    </el-col> -->
                    <el-col :span="4">
                        <el-button type="primary" @click="opBindData">查询</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </template>
        <el-table-column prop="materialCode" label="物料编码" width="100"></el-table-column>
        <el-table-column prop="materialName" label="物料名称" width="150"></el-table-column>
        <el-table-column prop="materialSpecs" label="规格" width="150"></el-table-column>
        <el-table-column prop="unitName" label="单位" width="110"></el-table-column>
        <el-table-column prop="materialTypeName" label="物料类别" width="120"></el-table-column>
        <el-table-column prop="statusDesc" label="状态" width="100"></el-table-column>
    </sc-table-select>
</template>

<script>
import tool from "@/utils/tool";
import bus from "@/utils/mitt";
export default {
    name: "orgselect",
    props: {
        queryType: { type: String, default: "material/pages" },
        queryList: { type: Object, default: {} },
        pageId: { type: String, default: "" },
        multiple: { type: Boolean, default: true },
        userCode: { type: String, default: "super" },
        purviewType: { type: String, default: "super" },
        selectKeyValue: { type: String, default: "Code" },
        props:{ type: Object, default:  {
                label: "materialName",
                value: "materialId",
                keyword: "keyword",
        }},
    },
    data() {
        return {
            hideClearBtn: true,
            attrList: {},
            valueList: {},
            materialQueryList: {},
            //apiObj: this.$API.demo.page,
            params: {
                name: "demoName",
            },
            orgcodevalue: [],
            materialTypeTree: [],
            // props: {
            //     label: "materialName",
            //     value: "materialId",
            //     keyword: "keyword",
            // },
            formatType(row, column) {
                // eslint-disable-next-line no-debugger
                ////debugger;
                console.log(row, column);
                switch (row.TypeCode) {
                    case "01":
                        return "直营店";
                    case "02":
                        return "加盟店";
                    default:
                        return "";
                }
            },
            lastOrgVal: [],
        };
    },
    created() {
        // 将 queryList 的值赋给 queryList
        this.materialQueryList = { ...this.queryList };
    },
    computed: {},
    mounted() {},
    methods: {
        async opBindData() {
            this.selectionRows = [];
            this.materialQueryList = {
                ...this.materialQueryList,
                ...this.queryList,
            };
            this.$nextTick(() => {
                this.$refs.tableselect.getData();
            });
        },
        //值变化
        change(val) {
            if (Array.isArray(val)) {
                if (val.length == 0) {
                    this.$emit("fatherMethod", []);
                } else {
                    this.$emit("fatherMethod", val);
                }
            } else {
                if (val) {
                    this.$emit("fatherMethod", val);
                }
            }
        },
        async initOptions() {
            try {
                var returnValue = await this.$API.auth.PostProcessApi.post(
                    "material-type/tree",
                    { status: 1 }
                );
                if (returnValue.status == 200) {
                    this.materialTypeTree = returnValue.response;
                } else {
                    this.$message.error("操作失败:" + returnValue.msg);
                }
            } catch (error) {
                this.loading = false;
                return false;
            }
        },
    },
    async mounted() {
        await this.initOptions();
    },
};
</script>

<style>
.custom-org-el-select-close .el-tag__close {
    display: none !important;
}
</style>
